<template>

  <div class="homeBox">
    <!--<p>我是推荐</p>-->
    <div id="addressStep1">

      <div class="pinggubigImg">
        <img src="../assets/addressBg.png" alt="">
      </div>
      <div class="pingguAddress">
        <div class="addressContent">
          <p>地址信息是对您进行信用评估的重要依据，请正确填写您的常用购物收货地址，可以提升信用评估的准确率。</p>
        </div>
        <!--地址-->
        <div class="addressInput" @click="chooseAddress()">
          <img src="../assets/dingwei.png" alt="">
          <span>地址:</span>
          <input type="text" id="oftenAddress" placeholder="请选择您的常驻收货地址" value="" v-model="getAddInfor" disabled="disabled" style="background: white">
        </div>
        <div class="likepinggu">
          <button id="pinggu" @click="remarkMoney()">立即评估额度</button>
        </div>
      </div>
      <!--立即评估额度-->
      <div class="pingguResult" v-show="pinggushow">
        <p>{{warnMessage}}</p>
      </div>
    </div>

  </div>
</template>

<script>
  import axios from 'axios'
  export default {
    name:'second',
    data() {
      return {
        pingguTocken:'',
        getAddInfor:this.$route.query.addInfor,
        addID:this.$route.query.addID,
        pinggushow:false,
        warnMessage:'',
        time:2000
      }
    },
    created() {
      var that = this;
      that.pingguTocken = sessionStorage.getItem('AuthToken');
    },
    methods: {
      chooseAddress() {
        this.$router.push({path:'/third'})
      },
      remarkMoney(){
        var that=this;
        axios.post('http://test.zjapi.xianxiangle.com/credit_facility',{
          AuthToken:that.pingguTocken,
          address_id:that.addID,
        }).then(function (res) {
          console.log(res);
          console.log(res.data.message);
          that.pinggushow = true;
          that.warnMessage='恭喜您获得'+res.data.data.audit_limit+'元额度！';
          window.setTimeout(function () {
            that.pinggushow = false;
            that.$router.push({path:'/first'})
          }, that.time);
        }).catch(function (err) {
        })
      }
    },
//   components: {
//     AppHeader
//   }
  }
</script>

<style lang="scss" scoped>

  .homeBox {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    background-color: #eee;
  }
  #addressStep1{
    width: 100%;
    margin: auto;
    background: #eeeeee;

    .pinggubigImg{
      width: 100%;
      height:auto;
      //border: 1px solid;
      //background: #ABE9DC;
      text-align: center;
      img{
        width: 100%;
        height:auto;
      }
    }
    .pingguAddress{
      width: 100%;
      height: 42%;
      background: #eeeeee;
      overflow: hidden;
      .addressInput{
        width: 100%;
        height: 4.6rem;
        line-height: 4.6rem;
        background: white;
        display: flex;
        justify-content: start;
        font-size: 1.6rem;
        img{
          width: 1.6rem;
          height: 1.6rem;
          position: relative;
          /* top: 1.4rem;*/
          right: 0.5rem;
        }
        span{
          display: inline-block;
          position: relative;
          right: 2.5rem;
          /*margin-left: 1rem;*/
          /*margin-right: 1rem;*/
        }
        input{
          width: 60%;
          //border: 1px solid;
          /*padding-left: 1rem;*/
          border: 0;
          outline: none;
          font-size: 1.6rem;
          position: relative;
          right: 3.5rem;
        }
      }
      .addressContent{
        width: 100%;
        margin: auto;
        p{
          width: 96%;
          color: #666666;
          margin: auto;
          padding: 1rem 0 2rem 0;
          background: #eeeeee;
        }
      }
      .pingguAddressType{
        width: 100%;
        text-align: center;
      }
      p{
        width: 100%;
        text-align: center;
        //font-size: 1.6rem;
        color: white;
      }
    }
    .likepinggu{
      width: 100%;
      text-align: center;
      margin-top:2rem;
      position: absolute;
      bottom: 1.6rem;
      left: 0;
      button{
        width: 96%;
        height:4rem;
        line-height: 4rem;
        background: #27DCB4;
        text-align: center;
        border-radius: 0.5rem;
        font-size:1.6rem;
        color: #ECF2EF;
        outline: none;
        border: 0;
      }
    }

    .pingguResult{
      width: 100%;
      height: 5rem;
      line-height: 5rem;
      position: absolute;
      top: 20rem;
      text-align: center;
      margin: auto;
      /*display: none;*/
      p{
        width: 90%;
        font-size: 2rem;
        color: white;
        border: 1px solid;
        border-radius: 1rem;
        text-align: center;
        background:rgba(0,0,0,0.4);
        margin: auto;
      }
    }
  }
</style>
